<!DOCTYPE html />
<html>
<head>
    <title>欢迎使用华夏保险办公自动化系统</title>
    <link href="test.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="bootstrap.min.css">
    <script src="jquery-1.11.3.min.js" type="text/javascript"></script>
    <script src="bootstrap.min.js" type="text/javascript"></script>
    <script src="JScript.js" type="text/javascript"></script>
    <style type="text/css">
        @font-face {
        font-family: 'Glyphicons Halflings';
        src: url('fonts/glyphicons-halflings-regular.eot');
        src: url('fonts/glyphicons-halflings-regular.eot');
        src: url('fonts/glyphicons-halflings-regular.woff');
        src: url('fonts/glyphicons-halflings-regular.ttf');
        src: url('fonts/glyphicons-halflings-regular.svg');
        }
    </style>
    <script type="text/javascript">
        /*------------------------------------------------------------左侧导航----------------------------------------------------------*/
        $(function () {
            $(".leftbg li").click(function () {
                $(".choose").removeClass("add");                      //为上次被选中的菜单取消所增加的背景
                $(".leftbg li img").attr("src", "select_xl01.png"); // 每次将所有菜单三角符号重置为向右
                $(this).find("img").attr("src", "select_xl.png");    //将本次点击菜单三角符号换为向下
                $(this).removeClass("choose");                        //若第二次选中同一菜单，则取消标记，避免其自动收回后再次滑动显示
                $(".choose").find(".sec li").slideUp(400);           //使上次被点击的菜单自动收回
                $(this).find(".sec li").slideToggle(400);              //使本次点击菜单上下滑动
                $(this).addClass("choose");                             //为本次选中的菜单增加标记
            });
        });
        /*------------------------------------------------------------左侧导航----------------------------------------------------------*/

        /*--------------------------------------------------------动态设置导航高度-----------------------------------------------------*/
        $(function () {
            var bg_height = parseInt($(".bg1").css("height"));
            var win_height = $(window).height();
            $(".leftbg").css("height", win_height - bg_height);
            $(".bg2").css("height", win_height - bg_height);
        });
        /*--------------------------------------------------------动态设置导航高度-----------------------------------------------------*/

        /*----------------------------------------------------------滑动图片导航--------------------------------------------------------*/
        $(".pic ul li").hover(function () {
            $(this).stop(true).animate({ width: "100px" }, 500);
        });
        /*----------------------------------------------------------滑动图片导航--------------------------------------------------------*/
    </script>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-xs-12 col-md-12 bg1">
                <div class="row">
                    <div class="col-md-2 col-md-offset-10">
                        <img src="logo2.png" alt="" class="img-responsive center-block" />
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-12 kk">
                        欢迎使用华夏保险OA系统
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-2 col-md-2 leftbg">                
                <ul>                    
                    <li>系统记录<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
    		                    <li><a href="#">充值记录</a></li>
			                    <li><a href="#">短信充值记录</a></li>
			                    <li><a href="#">消费记录</a></li>
			                    <li><a href="#">操作记录</a></li>
                            </ul>
                        </div>
                    </li>
                    <li>客户管理<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">客户管理</a></li>
			                    <li><a href="#">试用/成交客户管理</a></li>
			                    <li><a href="#">未成交客户管理</a></li>
			                    <li><a href="#">即将到期客户管理</a></li>
                            </ul>
                        </div>                
                    </li>
                    <li>渠道管理<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">渠道主页</a></li>
			                    <li><a href="#">渠道标准管理</a></li>
			                    <li><a href="#">系统通知</a></li>
			                    <li><a href="#">渠道商管理</a></li>
			                    <li><a href="#">渠道商链接</a></li>
                            </ul>
                        </div>
                    </li>
                    <li>APP管理<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">App运营商管理</a></li>
			                    <li><a href="#">开放接口管理</a></li>
			                    <li><a href="#">开放接口管理</a></li>
                            </ul>
                        </div>
                    </li>
                    <li>系统管理<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">后台用户管理</a></li>
			                    <li><a href="#">角色管理</a></li>
			                    <li><a href="#">客户类型管理</a></li>
			                    <li><a href="#">栏目管理</a></li>
			                    <li><a href="#">微官网模板组管理</a></li>
                                <li><a href="#">商城模板管理</a></li>
                                <li><a href="#">微功能管理</a></li>
                                <li><a href="#">修改用户密码</a></li>
                            </ul>
                        </div>
                    </li>
                    <li>素材库管理<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">图片库</a></li>
			                    <li><a href="#">链接库</a></li>
			                    <li><a href="#">推广管理</a></li>
                            </ul>
                        </div>
                    </li>
                    <li>统计分析<img src="select_xl01.png" alt="" />
                        <div class="sec">
                            <ul>
			                    <li><a href="#">客户统计</a></li>
                            </ul>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="col-xs-10 col-md-10 bg2">
                <div class="row">
                    <div class="col-md-12 pic">
                        <ul>
                            <li class="l1">
                                时事新闻
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
</html>
